import React from 'react';
import { postSofCashRefundCash } from '../../../../api'
import { Modal, Form, InputNumber, DatePicker, message } from 'antd'
import moment from 'moment'

/**
 * @description: 费用收纳-押金-退款窗口
 * @author: xiaoxujs
 * @updata: xiaoxujs（2021-07-28） 创建
 */

const NoMoneyModule = ({ setNoMoneyModuleShow, noMoneyModuleShow, clickId, listFun }) => {
    const [form] = Form.useForm()
    const { validateFields, resetFields } = form
    const handleOk = () => {
        validateFields().then(values => {
            values.actRefundDate = moment(values.actRefundDate).format('YYYY-MM-DD')
            values.id = clickId
            ; (async () => {
                const { code, msg } = await postSofCashRefundCash(values)
                if (code === '20000') {
                    message.success('押金退款成功!')
                    listFun()
                    resetFields()
                    setNoMoneyModuleShow(false);
                } else {
                    message.error(msg)
                }
            })()
        })
    };

    const handleCancel = () => {
        resetFields()
        setNoMoneyModuleShow(false);
    };
    return <Modal
        title="退款"
        visible={noMoneyModuleShow}
        onOk={handleOk}
        onCancel={handleCancel}
    >
        <Form
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
            form={form}
        >
            <Form.Item
                label="实退金额（元）"
                name="actRefund"
                rules={[{ required: true, message: '请输入实际退款金额!' }]}
            >
                <InputNumber />
            </Form.Item>
            <Form.Item
                label="退款时间"
                name="actRefundDate"
                rules={[{ required: true, message: '请输入退款时间!' }]}
            >
                <DatePicker />
            </Form.Item>
        </Form>
    </Modal>
}

export default NoMoneyModule;